import React, { Component } from 'react';
import {
    StyleSheet,
    View,
    Text,
    Image,
    TouchableOpacity,
    Dimensions,
    ScrollView,
    Platform,
    ListView,
    Navigator,
} from 'react-native';
import ScrollableTabView, { ScrollableTabBar, DefaultTabBar } from 'react-native-scrollable-tab-view';
const { width, height } = Dimensions.get('window');
export default class user extends Component { 
    render() {
      return (
        <View style={styles.container}>
        
         <View style={styles.viewTop}>
            <Text style={styles.txtTitle}>个人</Text>
        
                <Image source={require('../../img/scanning.png')} style={styles.iconSetting} />
            
          </View>
          <View style={styles.viewUser}>

           <View style={styles.viewUserTop}>
            <TouchableOpacity onPress={() => { this.props.navigation.navigate('Login') }}>
              <Image style={styles.imgUserTitle} source={require('../../img/3.jpg')}/>
            </TouchableOpacity>
          </View>
            <Text style={styles.txtName}>1234555555zZ</Text>
            <View style={styles.viewEdit}>
              <Image style={styles.iconEdit} source={require('../../img/yes.png')}/>
              <TouchableOpacity onPress={() => { this.props.navigation.navigate('Sys') }} style={styles.navLeft}>
                <Text style={styles.txtEdit}>编辑个人资料</Text>
                </TouchableOpacity>
            </View>
          </View>
          <View style={styles.viewLove}>
            <View style={styles.viewLoveTop}>
              <Text style={styles.txtCommon}>我的喜爱</Text>
              <TouchableOpacity onPress={() => { this.props.navigation.navigate('Sofa') }} style={styles.navLeft} >
              <Image style={styles.iconCommon} source={require('../../img/arrowright.png')}/>
              </TouchableOpacity>
           </View>
            <View style={styles.viewContent}>
              <Image style={styles.imgLove} source={require('../../img/java.jpg')}/>
              <Image style={styles.imgLove} source={require('../../img/javaee.png')}/>
              <Image style={styles.imgLove} source={require('../../img/javase.png')}/>
            </View>
          </View>
          <View style={styles.viewCommon}>
            <Text style={styles.txtCommon}>我的评论</Text>
            <Image style={styles.iconCommon} source={require('../../img/arrowright.png')}/>
          </View>
          <View style={styles.viewCommon}>
            <Text style={styles.txtCommon}>我参与的标签</Text>
            <Image style={styles.iconCommon} source={require('../../img/arrowright.png')}/>
          </View>
        </View>
      );
    }
  }
 const styles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: '#F0F0F0',
    },
    viewTop: {
      height: 60,
      backgroundColor: '#F0F0F0',
      alignItems: 'center',
      borderBottomWidth: 1,
      borderBottomColor: '#B7B7B7',
      flexDirection: 'row'
    },
    txtTitle: {
      flex: 1,
      marginLeft: 10
    },
    iconSetting: {
      marginRight: 10,
      width:20,
      height:20,
    },
    viewUser: {
      height: 250,
      backgroundColor: '#F0F0F0'
   },
    viewUserTop: {
      height: 100,
      alignItems: 'center',
      justifyContent: 'center'
    },
    imgUserTitle: {
      height: 80,
    width: 80,
      borderRadius: 40
    },
    txtName: {
      alignSelf: 'center'
    },
   txtGF: {
    alignSelf: 'center',
     marginTop: 40
   },
   viewEdit: {
     width: 150,
     marginTop: 20,
     height: 30,
     flexDirection: 'row',
      alignSelf: 'center',
      backgroundColor: '#E6E6E6',
     justifyContent: 'center',
     alignItems: 'center',
     borderRadius: 10
   },
   txtEdit: {
     marginLeft: 5,
     alignSelf: 'center',
   },
   iconEdit: {
     marginTop: 5,
     width:20,
     height:20,
   },
   viewLove: {
     height: 150,
     borderBottomWidth: 10,
     borderBottomColor: '#F0F0F0',
     backgroundColor: '#ffffff'
   },
   viewLoveTop: {
     height: 40,
     flexDirection: 'row',
     alignItems: 'center'
   },
   txtCommon: {
     marginLeft: 15,
     flex: 1
   },
   iconCommon: {
     marginRight: 10,
     width:20,
     height:20,
   },
   imgLove: {
     height: 100,
     width: 100,
     margin: 10,
     marginTop: 0,
   },
   viewCommon: {
     height: 50,
     borderBottomWidth: 10,
     borderBottomColor: '#F0F0F0',
     flexDirection: 'row',
     alignItems: 'center',
     backgroundColor: '#ffffff',
   },
   viewContent:{
    flex: 1, flexDirection: 'row'
   }
});
